<%@page import="java.util.Locale"%>
<%@page import="java.util.Calendar"%>
<%@page import="limousine.vo.Users"%>
<%@page import="limousine.util.*" %>
<%@page import="limousine.util.Token"%>
<%@page import="org.jsrpc.bridge.Key"%>
<%@taglib uri="/WEB-INF/struts-html.tld" prefix="h" %>
<%@taglib uri="/WEB-INF/struts-logic.tld" prefix="logic" %>
<%@taglib uri="/WEB-INF/struts-bean.tld" prefix="bean"%>
<%@taglib uri="/WEB-INF/jsrpc.tld" prefix="jsrpc"%>
<%@taglib uri="/WEB-INF/workforce.tld" prefix="work"%>
<%@page  contentType="text/html; charset=UTF-8" %>
<%
    Users user = (Users) session.getAttribute(Token.USER_SESSION);
    if (user == null) {
        System.out.println("--SESSION EXPIRE--");
    }
    //String roleName = user.roleName;
    String roleName = user.getRoleName();
    //String roleName = request.getParameter("role");
    String userId = user.getId();
    //String userId = request.getParameter("uid");
    String customerId = request.getParameter("cid");
    customerId = (customerId == null) ? "" : customerId;
%>
<!--
    Author by   : Krisada sangsanit.
    JSP Page    : carbooking.jsp
    create date : 7/11/2011  
//-->
<html>
    <head>
        <script src="js/calendarBook.js"     language="JavaScript" type="text/javascript"></script>
        <script src="js/calendar.js"         language="JavaScript" type="text/javascript"></script>
        <script src="js/ui.js"               language="JavaScript" type="text/javascript"></script>
        <script src="js/util.js"             language="JavaScript" type="text/javascript"></script>
        <script src="js/carbooking.js"       language="JavaScript" type="text/javascript"></script>
        <script src="app/js/tabber.js"              language="JavaScript" type="text/javascript"></script>
        <script src="js/JTableBooking.js"    language="JavaScript" type="text/javascript"></script>
        <script src="js/validation.js"       language="JavaScript" type="text/javascript"></script>
        <script src="js/JTable.js"           language="JavaScript" type="text/javascript"></script>
        <script type="text/javascript">
            <!--
            document.write('<style type="text/css">.tabber{display:none;}<\/style>');
            //-->
        </script>
        <jsrpc:broker>
            <jsrpc:register id="service" bean="workforce.limousine.service.BookingBeanManager"/>
        </jsrpc:broker>
        <script src="jsrpc.js" language="JavaScript" type="text/javascript"></script>
        <script language="JavaScript" type="text/javascript">
                       
            <!--
            var adminMode = <%
                if (roleName.equalsIgnoreCase("admin")) {
                    out.print("true");
                } else {
                    out.print("false");
                }
            %>;
                var userId = "<%=userId%>";
                var customerId = "<%=customerId%>";
                function initPage(tab) {<%
                    String s = request.getServletPath();
                    System.out.println("login.jsp[" + s + "]");
                    String sp[] = s.split("/");
                    StringBuffer sf = new StringBuffer();
                    /*for (int i = 2; i < sp.length; i++) {
                    sf.append("../");
                    }*/
                    String pageId = (String) pageContext.getAttribute(Key.PAGE_ID);
                    session.setAttribute("BACK_PATH." + pageId, sf.toString());
                    sf.append(request.getScheme());
                    sf.append("://");
                    sf.append(request.getServerName());
                    sf.append(":");
                    sf.append(request.getServerPort());
                    sf.append(request.getContextPath());
                    sf.append("/BROKER-REGISTER?pageId=").append(pageId);
                    System.out.println("path[" + sf.toString() + "]");
            %>
                    initBroker("<%=sf.toString()%>");
                    loadOptions();
                    loadBooking();
                    vtabber = tab; 
                }
                
            
                $(".panel").hide('fast');//hide menu       
                //-->
        </script>
        <link href="css/workforce.css"   rel="stylesheet" type="text/css" media="screen"/>
        <link href="app/css/tabber.css"         rel="stylesheet" type="text/css" media="screen"/>
    </head>
    <body>
        <div class="data_form">
            <div class="head_data_form"></div>
            <div class="show_form">
                <table width="100%" border="0" cellspacing="10" cellpadding="0">
                    <tr>
                        <td><strong></strong></td>
                    </tr>
                    <tr>
                        <td>
                            <table width="100%" border="0" cellspacing="5" cellpadding="0">
                                <tr>
                                    <td>
                                        <fieldset>
                                            <legend>
                                                <strong></strong>
                                            </legend>
                                            <table align="center" class="tableForm" border="0" width="100%">
                                                <tr>
                                                    <td valign="center">
                                                        <jsp:include page="sys_msg.jsp" />
                                                    </td>
                                                </tr>
                                                <% if (roleName.equalsIgnoreCase("admin")) {%>
                                                <tr>
                                                    <td>
                                                        <form id="formAdmin" name="formAdmin" action="#">
                                                            <input type="text" id="customerName" value="" size="30" onclick="clearCustomer()"/>
                                                            <button type="button" onclick="showCustomerPanel()"><img src="app/images/search_16.png"/>&nbsp;Customer</button>
                                                            <!-- input type="button" value="Select Customer" onclick="showCustomerPanel()"/ -->
                                                            <input type="hidden" id="customerId" value=""/>
                                                        </form>
                                                    </td>
                                                </tr>
                                                <% }%>
                                            </table>
                                            <div class="tabber">
                                                <div class="tabbertab">
                                                    <h2>List Of Dispatch</h2>
                                                    <div style="position: relative; height: 580px; overflow: auto">
                                                        <table id="tabledispatch" width="100%" border="1" style="border: thick; border-color:#999">
                                                            <tbody id="tabledispatchBody"/>
                                                        </table>
                                                    </div>    
                                                </div>
                                                <div class="tabbertab">
                                                    <h2>List Of Booking</h2>
                                                    <div style="position: relative; height: 580px; overflow: auto">
                                                        <table id="tablebooking" width="100%" border="1" style="border: thick; border-color:#999">
                                                            <tbody id="tablebookingBody"/>
                                                        </table>
                                                    </div>    
                                                </div>
                                                <div class="tabbertab">
                                                    <h2>Booking</h2>
                                                    <div style="position: relative; height: 580px; overflow: auto">
                                                        <form id="formBooking" action="/saveBooking" method="post">
                                                            <table width="100%" border="0" align="center">
                                                                <tr>
                                                                    <td id="div_status_1" width="20%" class="wLabel"><label >Status</label></td>
                                                                    <td id="div_status_2" width="40%">
                                                                        <work:list id="status" tooltipText="This is Booking Status."/>
                                                                    </td>
                                                                    <td id="div_status_3" width="40%"><div id="div_status_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_tripOption_1" class="wLabel"><label>Trip</label>
                                                                    <td id="div_tripOption_2">
                                                                        <work:list id="tripOption" tooltipText="This is Trip of select"/>
                                                                    </td>
                                                                    <td id="div_tripOption_3" width="40%"><div id="div_tripOption_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_carOption_1" class="wLabel"><label>Car</label>
                                                                    <td id="div_carOption_2">
                                                                        <work:list id="carOption" tooltipText="This is Car of select"/>
                                                                    </td>
                                                                    <td id="div_carOption_3" width="40%"><div id="div_carOption_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_driverOption_1" class="wLabel"><label>Driver</label></td>
                                                                    <td id="div_driverOption_2"><work:list id="driverOption" tooltipText="This is Driver of Booking"/>
                                                                    </td>
                                                                    <td id="div_driverOption_3" width="40%"><div id="div_driverOption_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_transportOption_1" class="wLabel"><label>Transport Type</label></td>
                                                                    <td id="div_transportOption_2"><work:list id="transportOption" tooltipText="This is Transport of Booking"/>
                                                                    </td>
                                                                    <td id="div_transportOption_3" width="40%"><div id="div_transportOption_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_bookingTypeOption_1" class="wLabel"><label>Booking Type</label></td>
                                                                    <td id="div_bookingTypeOption_2">
                                                                        <work:list id="bookingTypeOption" tooltipText="This is Type of Booking"/>
                                                                    </td>
                                                                    <td id="div_bookingTypeOption_3" width="40%"><div id="div_bookingTypeOption_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_targetTypeOption_1" class="wLabel"><label>Target Type</label></td>
                                                                    <td id="div_targetTypeOption_2"><work:list id="targetTypeOption" tooltipText="This is target of Booking"/>
                                                                    </td>
                                                                    <td id="div_targetTypeOption_3" width="40%"><div id="div_targetTypeOption_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_fromArea_1" valign="top" class="wLabel"><label>Area</label></td>
                                                                    <td id="div_fromArea_2">
                                                                        <work:text id="fromArea" label="From"  tooltipText="This is from date of booking" onFocus="fieldFocus(this)" onBlur="fieldBlur(this)"/>
                                                                        <work:text id="toArea" label="To&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" tooltipText="This is to date of booking" onFocus="fieldFocus(this)" onBlur="fieldBlur(this)"/>
                                                                    </td>
                                                                    <td id="div_fromArea_3" width="40%"><div id="div_fromArea_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_fromTime_1" valign="top" class="wLabel"><label>To Date</label></td>
                                                                    <td id="div_fromTime_2">
                                                                        <work:calendar id="fromTime" label="From Time"/>
                                                                        <work:calendar id="toTime" label="To Time&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"/>
                                                                    </td>
                                                                    <td id="div_fromTime_3" width="40%"><div id="div_fromTime_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_guest_1" class="wLabel"><label>Guest</label></td>
                                                                    <td id="div_guest_2">
                                                                        <work:text id="guest" tooltipText="This is guest of booking" onFocus="fieldFocus(this)" onBlur="fieldBlur(this)"/>
                                                                    </td>
                                                                    <td id="div_guest_3" width="40%"><div id="div_guest_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_time_1" class="wLabel"><label>At Time</label></td>
                                                                    <td id="div_time_2">
                                                                        <work:text id="time" tooltipText="This is time of booking"/>
                                                                    </td>
                                                                    <td id="div_time_3" width="40%"><div id="div_time_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_filght_1" class="wLabel"><label>Flight</label></td>
                                                                    <td id="div_filght_2">
                                                                        <work:text id="filght" tooltipText="This is filgh of booking" onFocus="fieldFocus(this)" onBlur="fieldBlur(this)"/>
                                                                    </td>
                                                                    <td id="div_filght_3" width="40%"><div id="div_filght_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_room_1" class="wLabel"><label>Room</label></td>
                                                                    <td id="div_room_2">
                                                                        <work:text id="room" tooltipText="this is room of booking" onFocus="fieldFocus(this)" onBlur="fieldBlur(this)"/>
                                                                    </td>
                                                                    <td id="div_room_3" width="40%"><div id="div_room_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_fastTrackOption_1" class="wLabel"><label>Fast Track</label>
                                                                    <td id="div_fastTrackOptionOption_2">
                                                                        <work:list id="fastTrackOption" tooltipText="This is Fast track of select"/>
                                                                    </td>
                                                                    <td id="div_fastTrackOption_3" width="40%"><div id="div_fastTrackOption_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_pax_1" class="wLabel"><label>No Pax</label></td>
                                                                    <td id="div_pax_2">
                                                                        <work:text id="pax" tooltipText="This is pax of booking" />
                                                                    </td>
                                                                    <td id="div_pax_3" width="40%"><div id="div_pax_msg"></div></td>
                                                                </tr>
                                                               <tr>
                                                                    <td id="div_paymentOption_1" class="wLabel"><label>Payment</label>
                                                                    <td id="div_paymentOption_2">
                                                                        <work:list id="paymentOption" tooltipText="This is Payment of select"/>
                                                                    </td>
                                                                    <td id="div_paymentOption_3" width="40%"><div id="div_paymentOption_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_rateChargeOption_1" class="wLabel"><label>Rate Charge</label>
                                                                    <td id="div_rateChargeOption_2">
                                                                        <work:list id="rateChargeOption" tooltipText="This is rate Charge of select"/>
                                                                    </td>
                                                                    <td id="div_rateChargeOption_3" width="40%"><div id="div_rateChargeOption_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_female_1" class="wLabel"><label>Female</label></td>
                                                                    <td id="div_female_2">
                                                                        <table>
                                                                            <tr>
                                                                                <td valign="bottom">
                                                                                    <div style="visibility: hidden" id="info_female" class="styleTooltip_default">This is female of booking</div>
                                                                                    <select name="female" id="female">
                                                                                        <option value="0">0</option>
                                                                                        <option value="1">1</option>
                                                                                        <option value="2">2</option>
                                                                                        <option value="3">3</option>
                                                                                        <option value="4">4</option>
                                                                                        <option value="5">5</option>
                                                                                        <option value="6">6</option>
                                                                                        <option value="7">7</option>
                                                                                        <option value="8">8</option>
                                                                                        <option value="9">9</option>
                                                                                    </select></td></td>
                                                                                <td valign="middle">
                                                                                    <img style="cursor: pointer;" src="imgs/info_16.png" alt="info" onmouseover="showInfo(this, event, 'info_female')">
                                                                                </td>
                                                                            </tr>
                                                                        </table>
                                                                    </td>
                                                                    <td id="div_female_3" width="40%"><div id="div_female_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_male_1" class="wLabel"><label>Male</label></td>
                                                                    <td id="div_male_2">
                                                                        <table>
                                                                            <tr>
                                                                                <td valign="bottom">
                                                                                    <div style="visibility: hidden" id="info_male" class="styleTooltip_default">This is male of booking</div>         
                                                                                    <select name="male" id="male">
                                                                                        <option value="0">0</option>
                                                                                        <option value="1">1</option>
                                                                                        <option value="2">2</option>
                                                                                        <option value="3">3</option>
                                                                                        <option value="4">4</option>
                                                                                        <option value="5">5</option>
                                                                                        <option value="6">6</option>
                                                                                        <option value="7">7</option>
                                                                                        <option value="8">8</option>
                                                                                        <option value="9">9</option>
                                                                                    </select>
                                                                                </td>
                                                                                <td valign="middle">
                                                                                    <img style="cursor: pointer;" src="imgs/info_16.png" alt="info" onmouseover="showInfo(this, event, 'info_male')">
                                                                                </td>
                                                                            </tr>
                                                                        </table>
                                                                    </td>
                                                                    <td id="div_male_3" width="40%"><div id="div_male_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_child_1" class="wLabel"><label>Child</label></td>
                                                                    <td id="div_child_2">
                                                                        <table>
                                                                            <tr>
                                                                                <td valign="bottom">
                                                                                    <div style="visibility: hidden" id="info_child" class="styleTooltip_default">This is child of booking</div>
                                                                                    <select name="child" id="child">
                                                                                        <option value="0">0</option>
                                                                                        <option value="1">1</option>
                                                                                        <option value="2">2</option>
                                                                                        <option value="3">3</option>
                                                                                        <option value="4">4</option>
                                                                                        <option value="5">5</option>
                                                                                        <option value="6">6</option>
                                                                                        <option value="7">7</option>
                                                                                        <option value="8">8</option>
                                                                                        <option value="9">9</option>
                                                                                    </select>
                                                                                </td>
                                                                                <td valign="middle">
                                                                                    <img style="cursor: pointer;" src="imgs/info_16.png" alt="info" onmouseover="showInfo(this, event, 'info_child')">
                                                                                </td>
                                                                            </tr>
                                                                        </table>
                                                                    </td>
                                                                    <td id="div_child_3" width="40%"><div id="div_child_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_carReq_1" class="wLabel"><label>Car Request</label></td>
                                                                    <td id="div_carReq_2">
                                                                        <table>
                                                                            <tr>
                                                                                <td valign="bottom">
                                                                                    <div style="visibility: hidden" id="info_carReq" class="styleTooltip_default">This is car register of booking</div>    
                                                                                    <select name="carReq" id="carReq">
                                                                                    </select>
                                                                                </td>
                                                                                <td valign="middle">
                                                                                    <img style="cursor: pointer;" src="imgs/info_16.png" alt="info" onmouseover="showInfo(this, event, 'info_carReq')">
                                                                                </td>
                                                                            </tr>
                                                                        </table>
                                                                    </td>
                                                                    <td id="div_carReq_3" width="40%"><div id="div_carReq_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_vcno_1" class="wLabel"><label>V/C No.</label></td>
                                                                    <td id="div_vcno_2">
                                                                        <work:text id="vcno" tooltipText="This is VC No of booking." />
                                                                    </td>
                                                                    <td id="div_vcno_3" width="40%"><div id="div_vcno_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_dropofftime_1" class="wLabel"><label>Drop Off Time</label></td>
                                                                    <td id="div_dropofftime_2">
                                                                        <work:text id="dropofftime" tooltipText="This is drop off time of booking." />
                                                                    </td>
                                                                    <td id="div_dropofftime_3" width="40%"><div id="div_dropofftime_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_verifyOption_1" class="wLabel"><label>Verify Staus</label>
                                                                    <td id="div_verifyOption_2">
                                                                        <work:list id="verifyOption" tooltipText="This is Verify Status of select"/>
                                                                    </td>
                                                                    <td id="div_verifyOption_3" width="40%"><div id="div_verifyOption_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td id="div_remark_1" valign="top" class="wLabel">
                                                                        <label>Remark</label>
                                                                    </td>
                                                                    <td id="div_remark_2">
                                                                        <work:textbox  id="remark" cols="45" rows="5" tooltipText="This is Remark of Limousing" onFocus="fieldFocus(this)" onBlur="fieldBlur(this)"/>
                                                                    </td>
                                                                    <td id="div_remark_3" width="40%"><div id="div_remark_msg"></div></td>
                                                                </tr>
                                                                <tr>
                                                                    <td>&nbsp;</td>
                                                                    <td>
                                                                        <work:field-hidden id="bookingId" name="bookingId"/>
                                                                        <work:field-hidden id="createBy" name="createBy"/>
                                                                        <button type="button" name="save" id="btnSave" value="Save" onclick="saveBooking()"><img src="app/images/save_16.png"/>&nbsp;&nbsp;Save</button>
                                                                        <input name="clear" id="btnReset" type="reset" value="Reset">
                                                                    </td>
                                                                    <td width="40%"></td>
                                                                </tr>
                                                            </table>
                                                        </form>
                                                    </div>                
                                                </div>
                                                <div id="calendarPanel" class="tabbertab">
                                                    <h2>Calendar</h2>
                                                    <form name="formCalendar" method="post" action="">
                                                        <%
                                                            java.util.Calendar c = java.util.Calendar.getInstance(Locale.US);
                                                            java.util.Date dd = new java.util.Date(c.getTimeInMillis());
                                                            java.text.SimpleDateFormat sfd = new java.text.SimpleDateFormat("yyyy-MM-dd hh:mm:ss");
                                                            String sdate = sfd.format(dd);
                                                        %>
                                                        <input type="hidden" id="txtCalendar" name="txtCalendar" value="<%=sdate%>">
                                                        <div id="div_calendar_book"></div>
                                                        <div id="calendar_book"></div>
                                                    </form>
                                                    <p>&nbsp;</p>
                                                </div>
                                            </div>
                                        </fieldset>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                </table>
            </div>
            <div class="bottom_data_form"></div>
        </div>
        <div id="div_calendar" style="position: absolute">                                                                   
            <div id="calendar" style="position: absolute"></div>
        </div>
        <div id="div_message" style="position: absolute; visibility: hidden">                                                                   
            <div id="message" style="position: absolute; visibility: hidden">
                <form id="messageForm" name="messageForm" action="#">
                    <table width="100%" height="100%" align="center">
                        <tr><td align="center"><div id="message_content"></div></td></tr>
                        <tr>
                            <td align="center">
                                <input type="button" id="btnMessage" name="btnMessage" value="Go Booking List" onClick="messageClose('')">
                            </td>
                        </tr>
                    </table>
                </form>
            </div>
        </div>                                                         
        <div id="div_customer_panel" style="position: absolute; visibility: hidden; border-color: #FFFFCC; background-color: #FFFFCC">
            <form id="custForm" name="custForm" action="#">
                <table>
                    <tr>
                        <td>
                            <input type="text" id="customerName" name="customerName" tooltipText="Use Customer Name search"/>
                            <input type="button" id="subCustomer" name="subCustomer" value="Find" onclick="findCustomer(0)"/>
                            <input type="button" id="closeCustomer" name="closeCustomer" value="Close" onclick="closeCustomerPanel()"/>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <table id="tablecustomer" width="100%" border="1" style="border: thick; border-color:#999; overflow: auto">
                                <tbody id="tablecustomerBody"/>
                            </table>
                        </td>
                    </tr>        
                </table>     
            </form>     
        </div>
        <div id="div_hiddingTab" style="visibility: hidden; position: absolute">
        </div>                                
    </body>                                            
</html>
